<template>
	<!-- 试题管理 -->
	<div style="padding: 20px;">
		<el-form :model="form" inline>
			<el-form-item>
				<el-input  v-model="form.title" placeholder="試題内容"></el-input>
			</el-form-item>
			<el-button icon="el-icon-search" circle @click="getPaper"></el-button>
			<el-button @click="dialogFormVisible = true"  >添加實體</el-button>
		</el-form>
		<el-table :data="tableData" border>
			<el-table-column align="center" prop="id" label="编号"></el-table-column>
			<el-table-column align="center" prop="content" label="試題内容"></el-table-column>
			<el-table-column align="center" prop="answer" label="正確答案"></el-table-column>
			<el-table-column align="center" label="可選答案">
				<el-table-column align="center" prop="a" label="A">
				</el-table-column>
				<el-table-column align="center" prop="b"  label="B">
				</el-table-column>
				<el-table-column align="center" prop="c"  label="C">
				</el-table-column>
				<el-table-column align="center" prop="d"  label="D">
				</el-table-column>
			</el-table-column>
		</el-table>
		<el-pagination
		v-if="total>0"
		  @size-change="search"
		  @current-change="search"
		  :current-page="pageNum"
		  :page-sizes="[2, 5, 10, 20]"
		  :page-size.sync="pageSize"
		  layout="total, sizes, prev, pager, next, jumper"
		  :total="total"
		>
		</el-pagination>
		
		<el-dialog title="添加試題"  :visible.sync="dialogFormVisible"  width="30%">
			<el-form :model="addTest" inline label-width="80px">
				<el-form-item label="試題内容">
					<el-input v-model="addTest.content"></el-input>
				</el-form-item>
				<el-form-item label="正確答案">
					<el-input v-model="addTest.answer"></el-input>
				</el-form-item>
				<el-form-item label="A選項">
					<el-input v-model="addTest.A"></el-input>
				</el-form-item>
				<el-form-item label="B選項">
					<el-input v-model="addTest.B"></el-input>
				</el-form-item>
				<el-form-item label="C選項">
					<el-input v-model="addTest.C"></el-input>
				</el-form-item>
				<el-form-item label="D選項">
					<el-input v-model="addTest.D"></el-input>
				</el-form-item>
			</el-form>
		
			
		<div slot="footer" class="dialog-footer">
		      <el-button @click="dialogFormVisible = false">取 消</el-button>
		      <el-button type="primary" @click="save">确 定</el-button>
		    </div>
		  </el-dialog>
	</div>
</template>

<script>
	export default {
		data(){
			return{
				addTest:{},
				dialogFormVisible:false,
				totla:0,
				pageNum:1,
				pageSize:10,
				tableData:[],
				form:{
					title:""
				}
			}
		},
		created() {
			this.search()
		},
		methods:{
			search(){
				this.request.get("/test",{
					params:{
						pageNum:this.pageNum,
						pageSize:this.pageSize,
						title:this.form.title
					}
				}).then(resp=>{
					this.tableData = resp.data.records
					this.total = resp.data.total
				})
			},
			save(){
				this.request.post("/test",this.addTest).then(resp=>{
					this.dialogFormVisible=false
					this.$message("添加完成")
					this.search()
				})
			}
		}
	}
</script>

<style>
</style>